<!--
/**
* Author: KSJ
* Date: 2022-07-22 15:21
* Desc: 购票组件
*/
-->
<template>
  <view @click="handleLook" class="pt30">
    <view v-if="type == 1" class="fs26 pb20">{{ item.publishDate }}</view>
    <view class="bb pb30">
      <view class="ticket-item flex">
        <view>
          <zm-image
            :src="item.cover"
            radius="8rpx"
            custom-style="width:130rpx;height:180rpx;margin-right:26rpx"
          ></zm-image>
        </view>

        <view class="detail">
          <view class="film-name fb fs30 ell">{{ item.filmName }}</view>
          <view class="flex flex-m fs24 fc-yellow">
            <zm-image
              is-join
              src="/love.png"
              custom-style="width:22rpx;height:19rpx;margin-right:10rpx;"
            ></zm-image>
            <view>{{ num || 0 }}人想看</view>
          </view>
          <view class="fs26 fc-gray" :class="{ hidden: !item.director }"
            >导演：{{ item.director || '' }}
          </view>
          <view class="ell fs26 fc-gray" :class="{ hidden: !item.cast }"
            >主演：{{ item.cast || '' }}</view
          >
        </view>
        <view class="ticket-item_right flex flex-col flex-right">
          <view
            v-if="item.preSaleFlag == 0"
            class="buy-btn flex flex-c flex-m fc-white bc-primary"
            @click.stop="handleBuy"
            >购票</view
          >
          <view
            v-if="item.preSaleFlag == 1"
            class="buy-btn flex flex-c flex-m fc-white bc-yellow"
            @click.stop="handleBuy"
            >预售</view
          >
          <view
            v-if="item.commission"
            class="fc-yellow flex-c-m fs18 commission"
            >佣金{{ item.commission }}元</view
          >
        </view>
      </view>
      <view class="mt20">
        <tip-type :tagList="item.tagList"></tip-type>
      </view>
    </view>
  </view>
</template>

<script>
  import ZmImage from '@/commons/ZmImage'
  import TipType from '@/components/TipType'
  export default {
    components: {
      ZmImage,
      TipType
    },
    props: {
      item: {
        type: Object
      },
      wantView: {
        type: [String, Number]
      },
      type: {
        type: [String, Number]
      }
    },
    computed: {
      num() {
        if (this.wantView > 10000) {
          return parseFloat(+(this.wantView / 10000).toFixed(2)) + 'w+'
        } else {
          return parseFloat((+this.wantView).toFixed(2))
        }
      }
    },
    data() {
      return {}
    },
    methods: {
      handleLook() {
        console.log('handleLook')
        this.$emit('look', this.item)
      },
      handleBuy() {
        this.$emit('buy', this.item)
      }
    }
  }
</script>

<style lang="scss" scoped>
  .ticket-item {
    width: 100%;
    background: #fff;
    box-sizing: border-box;
    overflow: hidden;
    .detail {
      display: flex;
      flex-direction: column;
      flex: 1;
      overflow: hidden;
      display: flex;
      margin-right: 30rpx;
      flex-direction: column;
      justify-content: space-evenly;
    }
    &_right {
      align-items: center;
      justify-content: center;
      .buy-btn {
        width: 110rpx;
        height: 60rpx;
        border-radius: 18rpx;
        margin-bottom: 12rpx;
      }
      .commission {
        border: #ffb415 1rpx solid;
        // width: 120rpx;
        height: 28rpx;
        line-height: 28rpx;
        padding: 0 5rpx;
        border-radius: 14rpx;
      }
    }
  }
</style>
